<template>
    <Card>
        <p slot="title">系统日志</p>

        <div class="search-con search-con-top">

            搜索：
            <Input v-model="searchData.search" style="width: 200px" placeholder="管理员、地址、参数"></Input>
            访问方式：
            <Select v-model="searchData.type" style="width:100px">
                <Option value="POST">POST</Option>
                <Option value="GET">GET</Option>
                <Option value="OPTIONS">OPTIONS</Option>
            </Select>
            日期查询：
            <DatePicker type="datetime" format="yyyy-MM-dd HH:mm" placeholder="开始时间" style="width: 150px"
                v-model="searchData.start_time"></DatePicker> -
            <DatePicker type="datetime" format="yyyy-MM-dd HH:mm" placeholder="截止时间" style="width: 150px"
                v-model="searchData.end_time"></DatePicker>
            <Button @click="search" type="primary" icon="ios-search" style="margin-left: 10px;">搜索</Button>
            <Button @click="reset" type="success" icon="ios-refresh" style="margin-left: 10px;">刷新</Button>
            <Button @click="clearLog" type="error" style="margin-left: 10px;">清除日志</Button>
        </div>
        <br>

        <Table :columns="columns" :data="list" border>
        </Table>
        <br>
        <Page :total="total" show-sizer show-total show-elevator @on-change="changePage" @on-page-size-change="changeSize">
        </Page>
    </Card>
</template>

<script>
import config from "@/config";
import { getToken } from "../../libs/util";
const baseUrl = process.env.NODE_ENV === "development" ? config.baseUrl.dev : config.baseUrl.pro;
export default {
    data() {
        return {
            searchData: {
                page: 1,
                limit: 10
            },
            // 列表
            columns: [
                {
                    title: "ID",
                    key: "id",
                },
                {
                    title: "管理员",
                    key: "user_name",
                },
                {
                    title: "域名",
                    key: "domain",
                },
                {
                    title: "地址",
                    key: "link",
                },
                {
                    title: "参数",
                    key: "params",
                },
                {
                    title: "方式",
                    key: "type",
                },
                {
                    title: "ip",
                    key: "ip",
                },
                {
                    title: "备注",
                    key: "remark",
                },
                {
                    title: "时间",
                    key: "create_time",
                },
            ],
            // 数据
            list: [],
            total: 0,
        };
    },
    methods: {
        search() {
            this.searchData.page = 1;
            this.getLogList();
        },
        reset() {
            this.searchData = {
                page: 1,
                limit: 10,
            };
            this.getLogList();
        },
        // 查询管理员信息
        getLogList() {
            let params = {
                ...this.searchData,
            };
            this.$axios("/admin/log/getList", params).then(res => {
                this.list = res.data;
                this.total = res.total;
            });
        },
        changePage(page) {
            this.searchData.page = page;
            this.getLogList();
        },
        changeSize(size) {
            this.searchData.limit = size;
            this.getLogList();
        },
        // 禁用
        clearLog() {
            this.$axios("/admin/log/clearLog", this.searchData).then(res => {
                this.$Message.success("删除成功");
                this.getLogList();
            });
        },
    },
    created() {
        this.getLogList();
    },
}
</script>
<style></style>
